<!DOCTYPE HTML>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="renderer" content="webkit|ie-comp|ie-stand">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
		<meta http-equiv="Cache-Control" content="no-siteapp" />
		<link rel="Bookmark" href="/favicon.ico">
		<link rel="Shortcut Icon" href="/favicon.ico" />
		<link rel="stylesheet" type="text/css" href="../static/h-ui/css/H-ui.min.css" />
		<link rel="stylesheet" type="text/css" href="../static/h-ui.admin/css/H-ui.admin.css" />
		<link rel="stylesheet" type="text/css" href="../lib/Hui-iconfont/1.0.8/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="../static/h-ui.admin/skin/default/skin.css" id="skin" />
		<link rel="stylesheet" type="text/css" href="../static/h-ui.admin/css/style.css" />
		<link rel="stylesheet" href="../lib/layui/css/layui.css">
		<link rel="stylesheet" href="../lib/zTree/v3/css/zTreeStyle/zTreeStyle.css">
		<style>

		</style>
		<title>资源管理</title>
	</head>

	<body>
		<!--修改参数-->
		<input type="hidden" id="update_id" />
		<input type="hidden" id="ztree_id" />
		<input type="hidden" id="isAdd" />
		<input type="hidden" id="parentNodeName" />

		<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 后台管理 <span class="c-gray en">&gt;</span> 资源管理
			<a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新"><i class="Hui-iconfont">&#xe68f;</i></a>
		</nav>
		<div class="page-container">
			<div class="layui-row">
				<div class="layui-col-md4">
					<div style="background-color:#f2f2f2;padding: 3px;min-height: 154px;">
						<ul id="myZtree" class="ztree"></ul>
						<a style="cursor: pointer;position: absolute;top: 5px;right:10px;font-size: 12px;color:blue;" onclick="refashZtree();">刷新</a>
					</div>
				</div>
				<div class="layui-col-md8" style="padding-left: 5px;">
					<div class="layui-inline">
						<input class="input-text" placeholder="清输入资源名称" id="name" autocomplete="off">
					</div>
					<div class="layui-inline">
						<input class="input-text" placeholder="清输入资源url" id="url" autocomplete="off">
					</div>
					<button class="layui-btn layui-btn-sm" onclick="tableReload();">搜索</button>
					<table class="layui-hide" id="tableList" lay-filter="tableList"></table>
				</div>
			</div>

		</div>
		<div id="pager" class="clearfix"></div>
		<!--_footer 作为公共模版分离出去-->
		<script type="text/javascript" src="../lib/jquery/1.9.1/jquery.min.js"></script>
		<script type="text/javascript" src="../lib/layer/2.4/layer.js"></script>
		<script type="text/javascript" src="../static/h-ui/js/H-ui.min.js"></script>
		<script type="text/javascript" src="../static/h-ui.admin/js/H-ui.admin.js"></script>
		<!--/_footer 作为公共模版分离出去-->
		<script type="text/javascript" src="../lib/layui/layui.js"></script>
		<script type="text/javascript" src="../lib/zTree/v3/js/jquery.ztree.all-3.5.js"></script>
		<script type="text/javascript" src="../static/js/common.js"></script>
		<!--请在下方写此页面业务相关的脚本-->
		<script type="text/javascript">
			var dataTable;
			var myZtree;
			var zNodes;
			var setting;
			$(function() {
				setting = {
					async: {
						enable: true,
						url: admin_url + "/scaPermission/getPerminssionZtree",
						autoParam: ["id"],
						otherParam: {
							"token": token,
							"tokenUserId": userId
						},
						dataFilter: filter
					},
					check: {
						enable: false,
						autoCheckTrigger: true
					},
					data: {
						simpleData: {
							enable: true
						}
					},
					edit: {
						enable: false,
						editNameSelectAll: true,
					},
					view: {
						selectedMulti: false,
						nameIsHTML: false,
						addHoverDom: addHoverDom,
						removeHoverDom: removeHoverDom,
					},
					callback: {
						beforeClick: function(treeId, treeNode, clickFlag) {
							return(treeNode.click != false);
						},
						onExpand: zTreeOnExpand,
						onClick: zTreeOnClick
					}
				};
				myZtree = $.fn.zTree.init($("#myZtree"), setting, zNodes);

			});

			function zTreeOnClick(event, treeId, treeNode) {
				$("#parentNodeName").val(treeNode.name);
			};

			function addHoverDom(treeId, treeNode) {
				var sObj = $("#" + treeNode.tId + "_span");

				if(treeNode.editNameFlag || $("#removeBtn_" + treeNode.tId).length > 0) return;
				var addStr = "<span class='ztreeOpr button remove_o' id='removeBtn_" + treeNode.tId + "' onclick='ztree_delete(" + treeNode.isParent + "," + treeNode.id + ");' title='删除'></span>";
				sObj.after(addStr);

				if(treeNode.editNameFlag || $("#editBtn_" + treeNode.tId).length > 0) return;
				var addStr = "<span class='ztreeOpr button edit_o' id='editBtn_" + treeNode.tId + "' onclick='ztree_edit(" + treeNode.id + ");' title='编辑'></span>";
				sObj.after(addStr);

				if(treeNode.editNameFlag || $("#addBtn_" + treeNode.tId).length > 0) return;
				var addStr = "<span class='ztreeOpr button add_o' id='addBtn_" + treeNode.tId + "' onclick='ztree_add(" + treeNode.id + ");' title='新增'</span>";
				sObj.after(addStr);

			};

			function ztree_add(id) {
				layer.open({
					title: "新增资源",
					type: 2,
					area: ['90%', '90%'],
					content: '../root/sys-permission-add.html'
				});
				$("#isAdd").val(1);
				$("#update_id").val(id);
			}

			function ztree_edit(id) {
				layer.open({
					title: "修改资源信息",
					type: 2,
					area: ['90%', '90%'],
					content: '../root/sys-permission-add.html'
				});
				$("#isAdd").val("");
				$("#update_id").val(id);
			}

			function ztree_delete(isParent, id) {
				if(isParent) {
					layer.msg("存在子节点不允许删除", {
						time: 800
					});
				} else {
					myConfirm("确认<span stype='color:red;'>删除</span>当前资源吗?", function() {
						var data = {
							"token": token,
							"tokenUserId": userId,
							"id": id
						};
						request_ajax("POST", admin_url + "/scaPermission/delPerminssion", data, function(result) {
							removeNode();
							layer.msg(result.msg, {
								time: 800
							});
						});
					});
				}

			}

			function refashZtree() {
				myZtree = $.fn.zTree.init($("#myZtree"), setting, zNodes);
			}

			function removeNode() {
				var treeObj = $.fn.zTree.getZTreeObj("myZtree");
				var nodes = treeObj.getSelectedNodes();
				for(var i = 0, l = nodes.length; i < l; i++) {
					treeObj.removeNode(nodes[i]);
				}
			}

			function removeHoverDom(treeId, treeNode) {
				$("#addBtn_" + treeNode.tId).unbind().remove();
				$("#editBtn_" + treeNode.tId).unbind().remove();
				$("#removeBtn_" + treeNode.tId).unbind().remove();
			}

			function zTreeOnExpand(event, treeId, treeNode) {
				if($("#ztree_id").val() != treeNode.id) {
					$("#ztree_id").val(treeNode.id);
					tableReload();
				}
			}

			function filter(treeId, parentNode, childNodes) {
				return childNodes.data
			};

			layui.use('table', function() {
				var table = layui.table;
				dataTable = table.render({
					elem: '#tableList',
					id: 'reload',
					method: 'POST',
					url: admin_url + '/scaPermission/perminssionList',
					page: true,
					request: {
						pageName: 'page',
						limitName: 'size'
					},
					response: {
						statusName: 'code',
						statusCode: 200,
						msgName: 'msg',
						countName: 'count',
						dataName: 'data'
					},
					where: {
						"token": token,
						"tokenUserId": userId,
					},
					cols: [
						[{
								checkbox: true,
								align: 'center',
							},
							{
								field: 'id',
								title: 'ID',
								align: 'center',
								width: 80
							},
							{
								field: 'name',
								title: '资源名称',
								align: 'center'
							},
							{
								field: 'type',
								title: '类型',
								align: 'center',
								templet: function(e) {
									if(e.type == 0) {
										return '菜单'
									} else if(e.status == 1) {
										return '功能'
									} else {
										return "";
									}
								}
							},
							{
								field: 'sort',
								title: '排序',
								align: 'center'
							},
							{
								field: 'url',
								title: 'url',
								align: 'center'
							},
							{
								field: 'status',
								title: '状态',
								align: 'center',
								templet: function(e) {
									if(e.status == 0) {
										return '<span class="layui-badge">禁用</span>'
									} else if(e.status == 1) {
										return '<span class="layui-badge layui-bg-green">正常</span>'
									} else {
										return "";
									}
								}
							},
							{
								field: 'permCode',
								title: '编码',
								align: 'center'
							},
							{
								field: '图标',
								title: '编码',
								align: 'center',
								templet: function(e) {
									if(e.icon) {
										return '<i class="Hui-iconfont">' + e.icon + '</i>';
									} else {
										return "";
									}

								}
							},
							{
								field: 'description',
								title: '描述',
								align: 'center',
							},

							{
								field: 'createTime',
								title: '创建时间',
								align: 'center'
							}
						]
					]
				});

			})

			function tableReload() {
				//执行重载
				dataTable.reload({
					where: {
						"token": token,
						"tokenUserId": userId,
						"name": $("#name").val(),
						"url": $("#url").val(),
						"id": $("#ztree_id").val()
					}
				});
			}
		</script>
	</body>

</html>